<!DOCTYPE html>
<html style="height: 100%">
<head>
    <title>需求首页</title>
    <% include ../../layouts/import.ejs %>
</head>
<body style="height: 100%;">
<% include ../../layouts/header.ejs %>
<% include ../../layouts/processHeader.ejs %>

<div class="height" style="background: #F8F6F2">
    <div class="container">
        <div class="row">
            <div class="col-md-2 requirement-left">
                <a href="" type="button" class="btn btn-primary" id="moduleAdd">添加模块</a>
                <ul id="moduleTree" class="ztree"></ul>
            </div>
            <div class="col-md-10 requirement-right">
                <div id="requirementToolbar" class="btn-group" role="group" aria-label="...">
                    <button type="button" class="btn btn-default" id="requirementAdd">添加</button>
                    <a type="button" class="btn btn-default" href="/process/requirement/generateDoc">生成需求文档(docx)</a>
                </div>
                <table id="requirementDataTable" class="table table-hover">

                </table>
            </div>
        </div>
    </div>

</div>

</body>

<script>
    var moduleTree;

    $(function () {
        $('#project-management').addClass('select-active');
        $("#requirement").addClass("click-change")

        var setting = {
            async: {
                enable: true,
                url: "/process/module/moduleTree",
                autoParam: ["id=parentId"]
            },
            edit: {
                enable: true
            },
            callback: {
                onClick: function (event, treeId, treeNode, clickFlag) {
                    $('#requirementDataTable').bootstrapTable(
                            'refresh',
                            {
                                query: {
                                    moduleId: treeNode.id
                                }
                            }
                    );
                },
                beforeRemove: function (treeId, treeNode) {
                    if (treeNode.isParent) {
                        alert('当前模块有子模块，不能删除');
                        return false;
                    } else {
                        moduleTree.selectNode(treeNode);
                        return confirm("确认删除“" + treeNode.name + "”吗？");
                    }
                },
                onRemove: function (event, treeId, treeNode) {
                    $.post('/process/module/delete/' + treeNode.id, function (result) {
                        if (result.errcode !== 0) {
                            console.log(result.message);
                        } else {
                            console.error(result.message);
                        }
                    })
                },
                onRename: function (event, treeId, treeNode, isCancel) {
                    $.post(
                            '/process/module/save',
                            {
                                id: treeNode.id,
                                moduleName: treeNode.name,
                                parentId: treeNode.pId,
                                depth: treeNode.level
                            },
                            function (result) {
                                if (result.errcode !== 0) {
                                    console.log(result.message);
                                } else {
                                    console.error(result.message);
                                }
                            }
                    )
                }
            }
        };
        moduleTree = $.fn.zTree.init($("#moduleTree"), setting);

        var requirementDataTable = $('#requirementDataTable').bootstrapTable({
            columns: [
                {
                    field: 'requirement_name',
                    title: '需求名称',
                    width: '35%'
                }, {
                    field: 'versionNumber',
                    title: '版本',
                    width: '10%'
                }, {
                    field: 'level',
                    title: '优先级',
                    width: '5%',
                    formatter: function (value, row, index) {
                        var valueStr = '';
                        switch (value) {
                            case 0:
                                valueStr = '<span style="color: gray;">低</span>';
                                break;
                            case 1:
                                valueStr = '<span style="color: black">普通</span>';
                                break;
                            case 2:
                                valueStr = '<span style="color: orange;">高</span>';
                                break;
                            case 3:
                                valueStr = '<span style="color: red;">紧急</span>';
                                break;
                            default:
                                valueStr = '<span style="color: black;">普通</span>';
                                break;

                        }
                        return valueStr;
                    }
                }, {
                    field: 'create_by_name',
                    title: '创建人',
                    width: '15%'
                }, {
                    field: 'create_time',
                    title: '创建时间',
                    width: '25%'
                }, {
                    title: '操作',
                    width: '10%',
                    align: 'center',
                    formatter: function (value, row, index) {
                        var id = row.id;
                        var result = "";
                        result += "<a href='/process/requirement/edit/" + id + "' class='btn btn-xs blue' title='编辑'><span class='glyphicon glyphicon-pencil'></span></a>";
                        result += "<a href='javascript:;' class='btn btn-xs red'  onclick=\"deleteRequirement(" + id + ")\" title='删除'><span class='glyphicon glyphicon-remove'></span></a>";

                        return result;
                    }
                }
            ],
            search: true,
            toolbar: '#requirementToolbar',
            url: '/process/requirement/listByModule'
        });

        $('#moduleAdd').on('click', function (e) {
            var selectedNodes = moduleTree.getSelectedNodes(),
                    treeNode = selectedNodes[0];
            if (treeNode) {
                treeNode = moduleTree.addNodes(treeNode, {pId: treeNode.id, name: "new node"});
            } else {
                treeNode = moduleTree.addNodes(null, {pId: 0, name: "new node"});
            }
            if (treeNode) {
                moduleTree.editName(treeNode[0]);
            } else {
                alert("叶子节点被锁定，无法增加子节点");
            }
        });

        $('#requirementAdd').on('click', function () {
            var selectedNodes = moduleTree.getSelectedNodes();
            if (selectedNodes && selectedNodes.length > 0) {
                var treeNode = selectedNodes[0];
                location.href = '/process/requirement/add?moduleId=' + treeNode.id;
            } else {
                location.href = '/process/requirement/add';
            }
        })

        $('#generateDoc').on('click', function () {
            console.log('generateDoc');

            $.post('/process/requirement/generateDoc', function (result) {
                console.log(result);
            })
        })
    })

    function deleteRequirement(id) {
        $.post('/process/requirement/delete/' + id, function (result) {
            if (result.errcode === 0) {
                var selectedNodes = moduleTree.getSelectedNodes();
                if (selectedNodes && selectedNodes.length > 0) {
                    var treeNode = selectedNodes[0];
                    $('#requirementDataTable').bootstrapTable(
                        'refresh',
                        {
                            query: {
                                moduleId: treeNode.id
                            }
                        }
                    );
                } else {
                    $('#requirementDataTable').bootstrapTable(
                        'refresh'
                    );
                }

            } else {
                console.error(result.message);
            }
        })
    }
</script>
</html>